@extends('layouts.home.home_master')
@section('head')
<script src="{{ asset('home/js/jquery-1.7.2.min.js') }}" ></script>
<script src="{{ asset('home/js/html5.js') }}" ></script>
<script src="{{ asset('home/js/jflow.plus.js') }}" ></script>
<script src="{{ asset('home/js/jquery.carouFredSel-5.2.2-packed.js') }}"></script>
<script>
$(document).ready(function(){
    $("#myController").jFlow({
        controller: ".control", // must be class, use . sign
        slideWrapper : "#jFlowSlider", // must be id, use # sign
        slides: "#slider",  // the div where all your sliding divs are nested in
        selectedWrapper: "jFlowSelected",  // just pure text, no sign
        width: "984px",  // this is the width for the content-slider
        height: "480px",  // this is the height for the content-slider
        duration: 400,  // time in miliseconds to transition one slide
        prev: ".slidprev", // must be class, use . sign
        next: ".slidnext", // must be class, use . sign
        auto: true
    });
    $('#list_product2').carouFredSel({
        prev: '#prev_c2',
        next: '#next_c2',
        auto: false
    });
    $(window).resize();
    $("button").click(function(){
         $(this).addClass('click')
    });
});
</script>
@endsection

@section('content')
<div class="container_12">
    <div class="grid_12">
        <div class="slidprev"><span>Prev</span></div>
        <div class="slidnext"><span>Next</span></div>
        <div id="slider">
         

        <div id="slide2">
            <img src="{{ asset('home/images/content/slide2.jpg') }}" alt="" title="" />
            <div class="slid_text">
                <h3 class="slid_title"><span>夏天的风～</span></h3>
                <p><span>特卖</span></p>
                <p><span>夏季折扣特卖</span></p>
            </div>
        </div>

        <div id="slide3">
            <img src="{{ asset('home/images/content/slide3.jpg') }}" alt="" title="" />
            <div class="slid_text">
                <h3 class="slid_title"><span>Accuracy and Easiness</span></h3>
                <p><span>Breeze design is mere and accurate,</span></p>
                <p><span>so it will satisfy everybody.</span></p>
            </div>
        </div>
        </div><!-- .slider -->
        <div id="myController">
            <div class="control"><span>1</span></div>
            <div class="control"><span>2</span></div>
            <div class="control"><span>3</span></div>
        </div>
    </div><!-- .grid_12 -->
</div><!-- .container_12 -->
<div class="copyrights">Collect from <a href="http://www.mycodes.net/"  title=""></a></div>
<div class="clear"></div>

<section id="main" class="home">
<div class="container_12">
    <div class="grid_10">
        <h2>产品分类</h2>
    </div><!-- .grid_10 -->
    <div id="top_button">
    @foreach($productCategories as $cate)
        <div class="grid_3">
          <a href="{{ url('/categories/'.$cate['product_category_id']) }}" class="button_block best_price">
            <span>{{ $cate['name'] }}</span>
          </a><!-- .best_price -->
        </div><!-- .grid_4 -->
        
    @endforeach
    <div class="clear"></div>
    </div><!-- #top_button -->

  <div class="clear"></div>

  <div class="carousel">
    <div class="c_header">
        <div class="grid_10">
            <h2>限量排行</h2>
        </div><!-- .grid_10 -->

        <div class="grid_2">
            <a id="next_c2" class="next arows" href="#"><span>Next</span></a>
            <a id="prev_c2" class="prev arows" href="#"><span>Prev</span></a>
        </div><!-- .grid_2 -->
    </div><!-- .c_header -->

    <div class="list_carousel">
    <ul id="list_product2" class="list_product">
        @foreach($limitedProducts as $product)
        <li class="">
        <div class="grid_3 product">
            <div class="prev">
                <a href="{{ url('/product/'.$product['product_id']) }}">
                    <img src="{{ asset('attachs/img/'.$product['photo']) }}" alt="" title="" />
                </a>
            </div><!-- .prev -->
            <h3 class="title">{{ $product['product_name'] }}</h3>
            <div class="cart">
                <div class="price">
                    <div class="vert">
                    @if(empty(Auth::user()->email))
                    <div class="price_new">***</div>
                    <div class="price_old">***</div>
                    @else
                    <div class="price_new">{{ $product['price'] }}</div>
                    <div class="price_old">{{ $product['price'] }}</div>
                    @endif
                    </div>
                </div>
                <a href="#" class="obn"></a>
                <a href="#" class="like"></a>
                <!-- <a href="#" class="bay"></a> -->
            </div><!-- .cart -->
        </div><!-- .grid_3 -->
        </li>
        @endforeach
    </ul><!-- #list_product2 -->
    </div><!-- .list_carousel -->
  </div><!-- .carousel -->
  <div class="clear"></div>
</div><!-- .container_12 -->
</section>
<!-- #main -->

<div class="clear"></div>
@endsection

